#hot{
    width: 100%;
    min-height: 493px;
    background: #ccc;
    padding-top: 30px;
    .hot{
        width: 1220px;
        min-height: 953px;
        border-radius: 5px;
        /* background: white; */
        margin: 0 auto;
        box-sizing: border-box;
        .hot-top{
            border: 1px solid rgb(175, 169, 169);
            border-bottom: none;
            border-radius: 5px 5px 0px 0px;
            width: 1220px;
            padding-left: 20px;
            height: 60px;
            background: rgb(226, 218, 218);
            box-sizing: border-box;
            h5{
                line-height: 60px;
                font-size: 20px;
                color: #666;
            }
          
           
        }

        .hot-bottom{
            // width: 1220px;
            // width: 25%;
            min-height: 880px;
            box-sizing: border-box;
            float: left;
            .hot-bottom-1{
                // flex: ;
                 
                background: white;
                min-height  : 430px;
                border: 1px solid rgb(175, 169, 169);
                border-right: none;
                float: left;
                box-sizing: border-box;
                cursor: pointer;
                position: relative;
                width: 305px;
                // margin-right: 5px;
                border:1px solid rgb(175, 169, 169);
                // border-radius: 0 0 0 5px;
                transition: all .3s ease-in-out;
                    .span1{
                        position: absolute;
                        z-index: 98;
                        left: 0;
                        top: 0;
                        right: 0;
                        bottom: 0;
                        transition: all .3s ease-in-out;
                    
                    }
                    .span2{
                        position: absolute;
                        z-index: 98;
                        left: 0;
                        top: 0px;
                        right: 0;
                        bottom: 0;

                     }
                     h3{
                         text-align: center;
                     }   

                
                    img{
                        width: 216px;
                        height: 216px;
                        padding: 32px 44.5px;
                    }
                     h3{
                        text-align: center;
                        font-size: 14px;
                    }
                     h5{
                        font-size: 12px;
                        color: #999;
                        text-align: center;
                        margin-top: 18px;
                    }
                     span:last-child{
                        display: block;
                        text-align: center;
                        font-size: 18px;
                        font-weight: bolder;
                        margin-top: 15px;
                        color: #d44d44;
                    }
                    .btn1{
                        width: 80px;
                        margin-left: 50px;
                        margin-top: 15px;
                        font-size: 12px;
                        cursor: pointer;
                        // height: 20px;
                    }
                    .btn2{
                        width: 80px;
                        margin-left: 30px;
                        margin-top: 15px;
                        font-size: 12px;
                        border: 1px solid cornflowerblue;
                        background: cornflowerblue;
                        cursor: pointer;
                        // height: 20px;
                    }
                    .btn2:hover{
                       color: #fff;
                    }
                  



                }
                .hot-bottom-1:hover .span1{
                    box-shadow: inset 0 0 38px rgb(0 0 0 / 20%);
                   
                }

         }
    }
}


   


